<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link th:href="@{/ruoyi/css/ry-ui.css}" rel="stylesheet"/>
<style>
    *{
        margin: 0;
        padding: 0;
        border: none;
    }
    .container{
        width: 80%;
        margin:100px  auto;
        display: flex;
    }
    .container>div{
    }
    .container .ma{
        width: 40%;
        margin-top :3%;
        height: 400px;
        background-size: 100% 100%;
    }

    .container .right{
        width: 50%;
        margin-left: 80px;
        margin-top: 50px;
    }
    .container .right div{
        display: flex;
        align-items: center;
        margin-bottom: 20px;
    }
    .container .right div img{
        width: 20%;
        height: 20%;
    }
    .container .right div p{
        font-size: 48px;
        margin-left: 10px;
    }
    .container .right>p{
       font-size: 28px;
        color: #999999;
    }

</style>
<body>
    <div class="container">
        <div class="ma"><img id="img01" src=""/></div>
        <div class="right">
            <div>
                <img src="../static/scanlogin.png" th:src="@{/scanlogin.png}">
                <P>扫码领取就餐券</P>
            </div>
            <P>打开报餐手机客户端点击“就餐”扫码以领取用餐券。</P>
            <P>1.本二维码是动态的，拍照无效</P>
            <P>2.  必须先订餐才可以领取</P>
        </div>
    </div>
    
    <script>
    	window.onload = init;
        var interval;
        var codeInfo = 'ZGluZ2NhbnhpdG9uZ29yZ2lk';
    	function init(){
    		$.ajax({
    	        type: "get",
    	        url: "/meals/meals/mobile/getQRCodeInfo",
    	        data: {
    	           
    	        },
    	        success: function(r) {
    	            if (r.code == 0) {
    	            	codeInfo = r.data.info;
    	            } else {
    	            	
    	            }
    	        }
    	    });
    		start();
            interval = setInterval("start()",60*1000);
    	}
        var ctx = "[[@{/}]]";
    	function start(){
	    	var imgObj = document.getElementById("img01");
	    	var timestamp =Date.parse(new Date());
	    	var param = codeInfo+"."+timestamp;
	    	imgObj.src = ctx + "meals/mobile/getQRCode?text=" + param;
            imgObj.onerror = function(){
                console.info("---------"+interval);
                clearInterval(interval);
            };
    	}
    </script>
    
<!-- 全局js -->
<script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
<script src="../static/js/bootstrap.min.js" th:src="@{/js/bootstrap.min.js}"></script>
<!-- 验证插件 -->
<script src="../static/ajax/libs/validate/jquery.validate.min.js" th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script>
<script src="../static/ajax/libs/validate/messages_zh.min.js" th:src="@{/ajax/libs/validate/messages_zh.min.js}"></script>
<script src="../static/ajax/libs/layer/layer.min.js" th:src="@{/ajax/libs/layer/layer.min.js}"></script>
<script src="../static/ajax/libs/iCheck/icheck.min.js" th:src="@{/ajax/libs/iCheck/icheck.min.js}"></script>
<script src="../static/ajax/libs/blockUI/jquery.blockUI.js" th:src="@{/ajax/libs/blockUI/jquery.blockUI.js}"></script>
<!-- <script src="http://tajs.qq.com/stats?sId=62048022"></script> -->
<script src="../static/ruoyi/js/ry-ui.js" th:src="@{/ruoyi/js/ry-ui.js?v=2.4.0}"></script>
<script src="../static/ruoyi/codeLogin.js" th:src="@{/ruoyi/codeLogin.js}"></script>
</body>
</html>
